<template>
	<view class="counter">
		<view class="header">
			<view class="circle"></view>
			<view class="header_text">{{baseData.quotaName}} </view>
		</view>

		<view class="note">
			<view class="note_left"> 备注： </view>
			<view class="note_right">
				{{baseData.remark}}
			</view>
		</view>
		<view class="cardmain">
			<view class="cardmain_top">
				<view class="cardmain_top_left"> 主材 </view>
				<view class="cardmain_top_right"> 共{{limitProductNum}}款商品 </view>
			</view>
			<view class="line"></view>

			<view class="card_catge"> 商品分类 </view>
			<view class="card_catge_list">
				<view class="card_catge_item" :class="item.show == true ? 'card_showline' : ''"
					v-for="(item,index) in mainarrylist" @click="selectMainlist(item,index)">
					<view class="card_catge_itemtext" :class="item.show == true ? 'card_showline_text' : ''">
						{{item.categoryName}}
					</view>
				</view>
			</view>

			<view class="card_publictitle" style="margin-top: 20rpx"> 属性筛选 </view>
			<view class="card_attribute">
				<view class="card_attribute_text" v-for="item in showChildlist">
					{{item.stastsName}}
				</view>
				<view style="padding-bottom: 32rpx">
				</view>
			</view>
		</view>

		<view class="card_auxiliary">
			<view class="cardmain_top">
				<view class="cardmain_top_left"> 辅材 </view>
				<view class="cardmain_top_right">
					{{materialObj.limitProductNum}}款选{{materialObj.productCheckedNum}}（指定商品)
				</view>
			</view>
			<view class="cardmain_top_line"></view>
			<view class="card_auxiliary_content">
				<view class="card_auxiliary_item" v-for="item in materialObj?.customerQuotaProductList">
					<image class="auxiliary_itemleft" mode="aspectFit" src=""></image>
					<view class="auxiliary_itemright">
						<view class="auxiliary_itemright_texttop">
							{{item.productAliasName}}
						</view>
						<view class="auxiliary_itemright_textdown">
							<view class="itemright_textdown_com"> 单价： </view>
							<view class="itemright_textdown_com" style="color: #ff4000; font-size: 28rpx">
								￥{{item.quoteUnitPrice}}
							</view>
							<view class="itemright_textdown_com"> /件 </view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view class="card_people">
			<view class="cardmain_top">
				<view class="cardmain_top_left"> 人工 </view>
				<view class="cardmain_top_right"> 费用合计：¥{{wordlist.quoteMoney}} </view>
			</view>
			<view class="cardmain_top_line"></view>
			<view class="card_people_content">
				<view class="card_people_item" v-for="item in wordlist.customerQuotaWorkerList" v-if="showpeople">
					<view class="card_people_title"> {{item.workerType}} </view>
					<view class="card_people_line"> </view>
					<view class="card_people_value">
						<view class=""> {{item.workerNum}} </view>
						<view class=""> ￥{{item.quoteUnitPrice}}</view>
						<view class=""> {{item.unit}} </view>
					</view>
					<view class="card_people_valuetwo">
						<view class=""> 数量 </view>
						<view class=""> 单价 </view>
						<view class=""> 计费方式 </view>
					</view>
				</view>

				<view class="card_people_item" v-for="item in  wordlist.quotaWorkerVOList" v-if="!showpeople">
					<view class="card_people_title"> {{item.workerType}} </view>
					<view class="card_people_line"> </view>
					<view class="card_people_value">
						<view class=""> {{item.workerNum}} </view>
						<view class=""> ￥{{item.quoteUnitPrice}}</view>
						<view class=""> {{item.unit}} </view>
					</view>
					<view class="card_people_valuetwo">
						<view class=""> 数量 </view>
						<view class=""> 单价 </view>
						<view class=""> 计费方式 </view>
					</view>
				</view>

			</view>
		</view>

		<view class="standard_title"> 工艺标准描述 </view>
		<view class="standard_countent">
			{{baseData.standardDesc}}
		</view>

		<view class="standard_title"> 优劣说明 </view>
		<view class="standard_countent">
			{{baseData.shortcomingDesc}}
		</view>

		<view class="standard_title"> 工艺标准图片 </view>
		<view class="pictute_countent">
			<image class="pictute_item" mode="aspectFit" v-for="item in baseData.picUrls?.split(',')||[]" :src="item">
			</image>
		</view>

		<view class="standard_title"> 工艺标准视频 </view>
		<view class="video_countent">
			<video class="video_item" v-for="item in baseData.videoUrls?.split(',')||[]" :src="item"></video>
		</view>
		<view style="height: 64rpx"> </view>
	</view>
</template>

<script setup>
	import {
		ref
	} from "vue";
	import {
		onLoad,
		onUnload
	} from "@dcloudio/uni-app";
	import circleTitle from "@/components/circle-title/index.vue";
	import {
		getWorkerList,
		getMainMaterial,
		quotaProductConditionList,
		getQuotaWorker
	} from "@/api/budgetQuota";
	const showpeople = ref(true)
	const baseData = ref({})
	const wordlist = ref({
		customerQuotaWorkerList: []
	})
	const materialObj = ref({
		customerQuotaProductList: []
	})
	const mainObj = ref({
		voList: []
	})
	const mainarrylist = ref([])
	const showChildlist = ref([])
	const limitProductNum = ref(0)
	onLoad((options) => {
		// 从路由参数获取动态标题
		const decodedData = JSON.parse(decodeURIComponent(options.data));
		const dynamicTitle = decodedData.spaceQuotatitle || "默认标题";
		uni.setNavigationBarTitle({
			title: dynamicTitle,
		});
		baseData.value = decodedData
		console.log(baseData.value);
		if (baseData.value.tabValue == 2) {
			getWorklisttwo()
			// getalldetail()
			// getcatgectlist(baseData.value.quotaId)
		} else {
			getWorklist()
			getalldetail()
			getcatgectlist(baseData.value.quotaId)
		}

	});
	onUnload(() => {
		uni.setStorage({
			key: 'yourKey',
			data: 'yourData',
		});
	})
	//人工
	const getWorklist = async () => {
		const {
			data
		} = await getWorkerList(baseData.value.contentId)
		showpeople.value = true
		wordlist.value = data
	}
	const getWorklisttwo = async () => {
		const {
			data
		} = await getQuotaWorker(baseData.value.quotaId)
		showpeople.value = false
		wordlist.value = data
	}
	//辅材
	const getalldetail = async () => {
		let Material = {
			productType: 2,
			budgetId: baseData.value.budgetId,
			contentId: baseData.value.contentId
		}
		const {
			data
		} = await getMainMaterial(Material)
		materialObj.value = data
	}
	//主材
	const getcatgectlist = async (v) => {
		const obj = {
			productType: 1,
			quotaId: v
		}
		const {
			data
		} = await quotaProductConditionList(obj.quotaId, obj.productType)
		mainObj.value = data
		mainarrylist.value = mainObj.value.voList
		if (mainarrylist.value.length !== 0) {
			mainarrylist.value.map(item => {
				item.show = false
			})
			mainarrylist.value[0].show = true
			limitProductNum.value = mainarrylist.value[0].limitProductNum
			showChildlist.value = mainarrylist.value[0].productProList
		}
	}
	const selectMainlist = (item, index) => {
		mainarrylist.value.map(v => {
			v.show = false
		})
		mainarrylist.value[index].show = true
		showChildlist.value = item.productProList
		limitProductNum.value = item.limitProductNum
	}
</script>

<style lang="scss" scoped>
	@import "index";
</style>